<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ include file="../../attr.jsp" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript" src="${ctx}/js/jquery.js"></script>
<title>系统流程图·</title>
<style>
		    .conent{width: 100%;height: 700px;background:#abcdef;margin:auto;position: relative;}
		    .conent div{margin:79px 0;}
		    .huishou{width: 150px;height:150px;left:675px;top:0;position: absolute;}
		    .qingxi{width: 150px;height:150px;left:865px;top:138px;position: absolute;}
		    .peibao{width: 150px;height:150px;left:792px;top:361px;position: absolute;}
		    .miejun{width: 150px;height:150px;left:557px;top:361px;position: absolute;}
		    .wpff{width: 150px;height:150px;left:484px;top:138px;position: absolute;}
		    .conent p{width: 150px;height:150px;display: flex;line-height: 100px;border-radius: 50%;text-align: center;}
		    .conent h6{margin-left: 34px;font-size: 16px;margin-left: 15px;text-align: center;color: #FFFFFF;}
		    .conent i{font-size: 60px;color: #FFFFFF;position: absolute;left: 57%;top: 20%;transform: rotate(45deg);}
		    .p1{background: url(../../imgs/0.1.png) no-repeat center center;background-size: cover;}
		    .flex{display: flex;justify-content: space-around;}
		    .conent h5{display: flex;height: 20px;}
		    .conent h5 img{width: 2%;line-height:20px;}
		    .conent h5 a{line-height: 20px;color: #FFFFFF;}
		    .p1 img{display: block;width: 54%;height: 54%;margin:35px auto}
		   .spanimg img{display: block;width: 2%;}
		   .p1 span{position: absolute;bottom:-40px;left: 40%;color: #1796A8;font-size: 14px;}	

</style>
</head>
<body>
	<div class="container-fluid">
	    <div class="conent">
		   <h5 class="" style="margin:0">
	   	 	<img src="${ctx}/imgs/home.png"/>
	   	 	<a href="${ctx}/shift/shiftList.do">进入首页</a>
	   	   </h5>
	   	  <div class="huishou">
	   	  	<p class="p1">
	   	  	<a href="#"><img src="${ctx}/imgs/hs.png"></a>
	   	  	<span>N0.1</span>
	   	    </p>
	   	    <h6>回收</h6>
	   	  </div>
	   	  <div class="qingxi">
	   	  	<p class="p1">
	   	  	<a href="#"><img src="${ctx}/imgs/slt.png"></a>
	   	  	<span>N0.2</span>
	   	    </p>
	   	    <h6>清洗消毒</h6>
	   	  </div>
	   	  <div class="peibao">
	   	  	<p class="p1">
	   	  	<a href="#"><img src="${ctx}/imgs/pb.png"></a>
	   	  	<span>N0.3</span>
	   	    </p>
	   	    <h6>配包</h6>
	   	  </div> 
	   	  <div class="miejun">
	   	  	<p class="p1">
	   	  	<a href="#"><img src="${ctx}/imgs/mj.png"></a>
	   	  	<span>N0.4</span>
	   	    </p>
	   	    <h6>灭菌</h6>
	   	  </div>
	   	   <div class="wpff">
	   	  	<p class="p1">
	   	  	<a href="#"><img src="${ctx}/imgs/wpff (2).png"></a>
	   	  	<span>N0.5</span>
	   	    </p>
	   	    <h6>物品发放</h6>
	   	  </div>
	   </div>
</div>
<script>
	  	$(function(){
	  		var a=1350;//长度
	        var w=400;//宽度
	        var r=200;//半径
	  		var d1x = a/2;
	  		var d1y = w/2-r;
	  		var d2x = a/2+r*(Math.sin(72*Math.PI/180));
	  		var d2y = w/2-r*(Math.cos(72*Math.PI/180));
	  		var d3x = a/2+r*(Math.sin(36*Math.PI/180));
	  		var d3y = w/2+r*(Math.cos(36*Math.PI/180));
	  		var d4x = a/2-r*(Math.sin(36*Math.PI/180));
	  		var d4y = w/2+r*(Math.cos(36*Math.PI/180));
	  		var d5x = a/2-r*(Math.sin(72*Math.PI/180));
	  		var d5y = w/2-r*(Math.cos(72*Math.PI/180));
	  		console.log(d1x,d1y);
	  		console.log(d2x,d2y);
	  		console.log(d3x,d3y);
	  		console.log(d4x,d4y);
	  		console.log(d5x,d5y);
	  	})
	  </script>
</body>
</html>